import CodeEditor from './code-editor/index.vue'
import CodeEditorFormula from './code-editor-formula/index.vue'
import SettingPanel from './setting-panel/index.vue'
import WidgetForm from './widget-form/index.vue'
import WidgetFormItem from './widget-form-item/index.vue'
import WidgetPanel from './widget-panel/index.vue'
import Designer from './designer/index.vue'
import DesignerMobile from './designer-mobile/index.vue'
import DetailForm from './detail-form/index.vue'
import RenderForm from './render-form/index.vue'
import ImageViewer from './image-viewer/index.vue'
import SvgIcon from './svg-icon/index.vue'
import fields from './widget-form/field/index'

const components = [
  { name: 'CodeEditor', component: CodeEditor },
  { name: 'CodeEditorFormula', component: CodeEditorFormula },
  { name: 'EpFormMaking', component: Designer },
  { name: 'VanFormMaking', component: DesignerMobile },
  { name: 'DetailForm', component: DetailForm },
  { name: 'ImageViewer', component: ImageViewer },
  { name: 'RenderForm', component: RenderForm },
  { name: 'SettingPanel', component: SettingPanel },
  { name: 'WidgetForm', component: WidgetForm },
  { name: 'WidgetFormItem', component: WidgetFormItem },
  { name: 'WidgetPanel', component: WidgetPanel },
  { name: 'MIcon', component: SvgIcon }
]

export default (App) => {
  components.forEach((m) => {
    App.component(m.name, m.component)
  })

  Object.keys(fields).forEach((name) => {
    App.component(name, fields[name])
  })
}

export { RenderForm, DetailForm, ImageViewer }
